<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" th:with="title='用户编辑',active='user'">
<header th:replace="back/header::headerFragment(${title},${active})"></header>
<head>
    <!-- 引入Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">

    <!-- 引入jQuery库 -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <!-- 引入Bootstrap JS -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<!-- 模态框 -->
<div class="modal-header">
    <h5 class="modal-title" id="editUserModalLabel">编辑商品信息</h5>
    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">&times;</span>
    </button>
</div>
<div class="modal-body">
    <form  id="editForm"  th:object="${busGoodsInfo}">
        <div class="form-group">
            <input type="hidden"  id="id" name="id" th:field="*{goods_id}" required>
        </div>
        <div class="form-group">
            <label for="name">名称：</label>
            <input type="text" class="form-control" id="name" name="name" th:field="*{goods_name}" required>
        </div>
        <div class="form-group">
            <div class="form-group">
                <label for="content">简介：</label>
                <input type="text" class="form-control" id="content" name="content" th:field="*{goods_content}"  >
            </div>
        </div>
        <div class="form-group">
            <label for="priece">价格：</label>
            <input type="text" class="form-control" id="priece" name="priece" th:field="*{goods_priece}" required>
        </div>
        <div class="form-group">
            <label for="type">类型：</label>
            <input type="text" class="form-control" id="type" name="type" th:field="*{goods_type}" required>
        </div>

        <!--        <div class="form-group">-->
        <!--            <label for="averageprice">图片：</label>-->
        <!--            <input type="file" id="uploadInput" accept="image/*">-->
        <!--        </div>-->
        <button type="submit" class="btn btn-primary" id="saveBtn" >保存</button>
    </form>
</div>
<script>
    $(document).ready(function() {
        // 处理保存按钮的点击事件
        $("#saveBtn").click(function(e) {
            e.preventDefault(); // 阻止默认的表单提交行为

            var goods ={
                goods_id:parseInt($("#id").val()),
                goods_name:$("#name").val(),
                goods_content:$("#content").val(),
                goods_priece:$("#priece").val(),
                goods_type:$("#type").val()
            }

            console.log(goods)
            // var fileInput = document.getElementById("uploadInput");
            // var file = fileInput.files[0];


            // 发送AJAX请求保存表单数据
            $.ajax({
                url: "/admin/goods/saveGoods",
                type: "GET",
                data: goods,
                contentType: "application/json",
                success: function(response) {
                    // 处理成功响应
                    console.log("商品数据保存成功");
                    $("#editModal").modal("hide");
                    location.reload();
                },
                error: function(xhr, status, error) {
                    // 处理错误响应
                    console.error("保存商品数据出错：", error);
                    // 可以显示错误消息或执行其他错误处理操作
                }
            });
        });
    });

</script>
</html>




